.user-settings-repos {
    &__gitlab {
        fill: #ff5900 !important;
    }
    &__github {
        fill: var(--body-color) !important;
    }
    &__check {
        fill: var(--color-bg-3) !important;
    }

    &__shimmer {
        background: linear-gradient(to right, var(--color-bg-2) 4%, var(--color-bg-1) 25%, var(--color-bg-2) 36%);
        animation: shimmer 2s infinite linear;
        background-size: 1000px 100%;
        border-radius: 5px;
    }

    &__repositorynode {
        border-color: var(--border-color-2) !important;

        &:hover {
            background-color: var(--color-bg-1);
        }
    }

    &__container {
        border-color: var(--border-color-2) !important;
    }

    &__link:hover {
        text-decoration: none;
    }

    &__pages {
        display: flex;
        align-items: baseline;
        width: 80%;
        flex-wrap: wrap;
        margin-left: auto;
        margin-right: auto;
    }

    &__pageend {
        margin-left: 0.5rem;
        margin-right: 0.5rem;
    }

    &__page {
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 3px;
        background-color: var(--color-bg-2);
        margin-right: 0.25rem;
        margin-bottom: 0.25rem;
        width: 1.5rem;
        height: 1.5rem;
        font-size: 12px;
        &--active {
            background-color: inherit;
        }
        &:hover {
            background-color: var(--color-bg-1);
        }
    }

    &__chevron {
        &--inactive {
            fill: var(--border-color-2);
        }
    }

    &__filter-input {
        max-width: 30% !important;
    }
}

@keyframes shimmer {
    0% {
        background-position: -1000px 0;
    }
    100% {
        background-position: 1000px 0;
    }
}
